<!--<!DOCTYPE html>-->
<html>
	<head>
		<meta charset="UTF-8">
		<title>about</title>
		<link rel="stylesheet" type="text/css" href="css/program.css"/>
		<style>
	*{margin:0;padding:0;list-style:none;}
	html,body{height:100%;}
	/* 以下是CSS3样式，适合高版本浏览器 */
	.Snowflake{animation:linear spin infinite 20s;-webkit-animation:linear spin infinite 20s;-moz-animation:linear spin infinite 20s;pointer-events:none;}
	@keyframes spin{
		0% {transform:rotate(0deg);}
		100% {transform:rotate(359deg);}
	}
	@-webkit-keyframes spin{
		0% {-webkit-transform:rotate(0deg);}
		100% {-webkit-transform:rotate(359deg);}
	}
	@-moz-keyframes spin{
		0% {-moz-transform:rotate(0deg);}
		100% {-moz-transform:rotate(359deg);}
	}
	</style>
	</head>
	<body>
		<!--头部区域-->
		<header>
			<!--插入logo-->
			<div id="logo">
				<img src="img/img1/shininglogo.png" />
			</div>
			<!--导航栏-->
			<div id="navigation">
				<a href="home.html">Home</a>
				<a href="about.html">About</a>
				<a href="rendering.html">Rendering</a>
				<a href="3DAnimation.html">3D Animation</a>
				<a href="Bin.html">Bin</a>
				<a href="contact.html">Contact</a>
			</div>
			<div id="navigationMerge">
				<img src="img/img1/nav.png" />
			</div>
		</header>
		<ul id="navigationHidden">
			<li>
				<a href="home.html">Home</a>
			</li>
			<li>
				<a href="about.html">About</a>
			</li>
			<li>
				<a href="rendering.html">Rendering</a>
			</li>
			<li>
				<a href="3DAnimation.html">3D Animation</a>
			</li>
			<li>
				<a href="Bin.html">Bin</a>
			</li>
			<li>
				<a href="contact.html">Contact</a>
			</li>
		</ul>
		<div id="aboutContent">
			<img src="img/img2/world_map.png"/>
			<div id="aboutText">
				<h2>About Us</h2>
Shanghai Shining is a creative corporation which focuses on helping architects and owners turn their construction which is still in design stage into visual images or videos, perfectly showing the essence of construction.
<br /><br />
Since the year of 1998, we have finished more than 20000 3D visualization creativities of all Kinds of architecture for nearly 2000 architect firms both at home and abroad. We have used 3D technology, shooting, drawing and architectonic to provide the clients with the services of CG images, CG animations, BIM and 3D products finally
			</div>
			<!--about下面图片-->
			<ul id="aboutImg">
				<li>
					<img src="img/img2/aedas.png"/>
				</li>
				<li>
					<img src="img/img2/bdp.png"/>
				</li><li>
					<img src="img/img2/edsa.png"/>
				</li><li>
					<img src="img/img2/kpf.png"/>
				</li>
				<li>
					<img src="img/img2/gensler.png"/>
				</li>
				<li>
					<img src="img/img2/sasaki.png"/>
				</li>
			</ul>
		</div>
	    <footer>
			<div id="footerTop">
				<img src="img/img1/footer0.jpg" />
			</div>
			<div id="footerCenter">
				<img src="img/img1/footer1.jpg" />
				<img src="img/img1/footer2.jpg" />
				<img src="img/img1/footer3.jpg" />
				<img src="img/img1/footer4.jpg" />
			</div>
			<div id="footerBottom">
				Copyright © 1998-2015 shining Group
			</div>
		</footer>
		<script src="js/jquery-2.2.4.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/jsPicture.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/snowflake.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
		createSnow('', 200);
		$(window).css("overflow","scroll")
			$("footer").css({
				top: $("header").height() + $("#aboutContent").height() + 50 ,
				backgroundColor:"white"
				
			});
			clearInterval(createSnow,100);
			console.log($('header').height())
		</script>
	</body>
</html>
